﻿<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>创建图标</title>
    <style type="text/css">
        #maps
        {
            height: 450px;
        }
    </style>
<!--    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=zh-CN"></script>-->
    <script type="text/javascript" src="http://ditu.google.cn/maps/api/js?sensor=false&language=zh-CN"></script>
    <script type="text/javascript" language="javascript">
        //地图初始化函数
        function initialize() {
            var Options = {
                zoom: 10, center: new google.maps.LatLng(39, 117), mapTypeId: google.maps.MapTypeId.ROADMAP
            }
            
            var map = new google.maps.Map(document.getElementById("maps"), Options);
            google.maps.LabelMarker = function(latlng, options) {
                this.latlng = latlng;
                this.labelText = options.labelText || '';
                this.labelClass = options.labelClass || 'writeb';
                this.labelOffset = options.labelOffset || new google.maps.Size(8, -33);
                options.icon = options.icon || getTextIcon();
                google.maps.Marker.apply(this, arguments);
            }

            google.maps.LabelMarker.prototype = new google.maps.Marker(new google.maps.LatLng(39, 117));

            google.maps.LabelMarker.prototype.initialize = function(map) {
                google.maps.Marker.prototype.initialize.call(this, map);

                var label = document.createElement('div');
                label.className = this.labelClass;
                label.innerHTML = this.labelText;
                label.style.position = 'absolute';
                label.style.width = '48px';
                map.getPane(G_MAP_MARKER_PANE).appendChild(label);

                this.map = map;
                this.label = label;
            }
            google.maps.LabelMarker.prototype.redraw = function(force) {
                google.maps.Marker.prototype.redraw.call(this, map);

                if (!force) {
                    return;
                }
                var point = this.map.fromLatLngToDivPixel(this.latlng);
                var z = google.maps.Overlay.getZIndex(this.latlng.lat());

                this.label.style.left = (point.x + this.labelOffset.width) + 'px';
                this.label.style.top = (point.y + this.labelOffset.height) + 'px';
                this.label.style.zIndex = z + 1;
            }

            google.maps.LabelMarker.prototype.remove = function() {
                this.label.parentNode.removeChild(this.label);
                this.label = null;
                google.maps.Marker.prototype.remove.call(this);
            }
            var n = 21; //在这里接收要显示的信息，文字要用双引号""
            function getTextIcon() {

                var icon = new google.maps.MarkerImage("./fox.gif",
			new google.maps.Size(37, 37),
			new google.maps.Point(0, 40),
			new google.maps.Point(5, 1));

                //                var icon = google.maps.MarkerImage();
                //                //    icon.image = "http:labs.google.com/ridefinder/images/mm_20_red.png";  
                //                icon.image = "./fox.gif";
                //                icon.iconSize = new google.maps.Size(37, 37);
                //                icon.iconAnchor = new google.maps.Point(0, 40);
                //                icon.infoWindowAnchor = new google.maps.Point(5, 1);

                return icon;
            }
            var marker = new google.maps.LabelMarker(map.getCenter(), { labelText: n }); //在这加入n

            //map.addOverlay(marker);
        }
                   
    </script>

</head>
<body onload='initialize()'>
    <div id="maps">
    </div>
</body>
</html>

